<template>
    <view>
        <mescroll-body
            ref="mescrollRef"
            @init="mescrollInit"
            :down="downOption"
            @down="downRefresh"
            :up="upOption"
            @up="getData">
            <view class="wrapper">
                <view class="total" v-if="length > 0"> 共计{{ length }}笔付款订单 </view>
                <view class="list" @click="goDetail(item)" v-for="(item, index) in datas">
                    <view class="num">{{ index + 1 }}</view>
                    <view class="sn">{{ item.OrderSn }}</view>
                    <view class="price">￥{{ item.Money }}</view>
                    <uni-icons type="arrowright" size="20" customIcons="icon-gray-1"></uni-icons>
                </view>
            </view>
        </mescroll-body>
    </view>
</template>
<script>
import { GetRecodePage } from "@/pages_supplier/service/api/period.js"
export default {
    props: {},
    components: {},
    data() {
        return {
            datas: [],
            length: 0,
            productList: [],
            param: {},
            downOption: {
                use: true,
            },
            requestData: {
                pageIndex: 1,
                pageSize: 20,
            },
            optEmpty: {
                icon: "/static/img/empty.png", // 图标路径 (建议放入static目录, 如 /static/img/mescroll-empty.png )
                tip: "~ 暂无数据 ~", // 空提示
            },
        }
    },
    onLoad(e) {
        console.log(e)
        this.requestData.moneyType = Number(e.moneyType)
        this.requestData.periodId = Number(e.id)
        if (Number(e.moneyType) == 0) {
            uni.setNavigationBarTitle({
                title: "付款订单",
            })
        } else if (Number(e.moneyType) == 1) {
            uni.setNavigationBarTitle({
                title: "退款订单",
            })
        }
    },
    mounted() {
        //#ifndef MP
        this.refresh(this.requestData)
        //#endif
        console.log(this.state)
    },
    methods: {
        //获取列表数据
        getData(page) {
            let param = this.requestData
            // param.pageSize = page.size
            param.pageIndex = page.num
            GetRecodePage(param).then((res) => {
                if (res.State == 1) {
                    this.mescroll.endBySize(res.Data.length, res.RecordAmout)
                    this.datas = this.datas.concat(res.Data)
                    this.length = res.RecordAmout
                    console.log(this.datas)
                } else {
                    this.mescroll.endBySize(0, 0)
                }
            })
        },
        goDetail(item) {
            if (this.requestData.moneyType == 0) {
                //付款单
                this.easyGoTo("/pages_supplier/packet/supplyOrder/orderDetail?id=" + item.RelateId)
            } else if (this.requestData.moneyType == 1) {
                //退款单
                this.easyGoTo("/pages_supplier/packet/returnOrder/detail?id=" + item.RelateId)
            }
        },

        //刷新
        refresh(requestData) {
            this.downRefresh(requestData, true)
        },
        //刷新
        downRefresh(requestData, isSetParam = false) {
            this.datas = []
            if (isSetParam) {
                this.param = requestData
            }
            this.mescroll.resetUpScroll()
        },
    },
}
</script>

<style lang="scss">
.wrapper {
    padding: 24rpx;
}
.total {
    font-size: 28rpx;
    margin-bottom: 4rpx;
    font-weight: 500;
}

.list {
    padding-bottom: 24rpx;
    padding-top: 40rpx;
    border-bottom: 1px solid #ebebeb;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 28rpx;
    font-weight: 400;
    .num {
        flex-shrink: 0;
        padding: 0 24rpx;
    }
    .sn {
        flex: 1;
        padding: 0 24rpx;
    }
    .price {
        flex-shrink: 0;
        padding: 0 24rpx;
    }
}
</style>
